<template>
    <div class="card-wrap flex-column justify-end card-padding">
        <table-page :loading="loading" :dataList="dataList" :total="total" :page.sync="queryParam.pageNum"
                    :limit.sync="queryParam.pageSize" @setSizeCurrent="getList" border>

            <template slot="tableCol">
                <el-table-column
                    align="center"
                    type="index"
                    min-width="80"
                    label="序号">
                </el-table-column>

                <el-table-column
                    prop="approvalStatus"
                    label="过户状态"
                    align="center"
                    show-overflow-tooltip
                    min-width="180">
<!--                    过户状态 1.审批中，2审批通过，3审批拒绝-->
                    <template v-slot="{row}">
                        {{1==row.approvalStatus?'审批中':
                            2==row.approvalStatus?'审批通过':
                            3==row.approvalStatus?'审批拒绝':'--'
                        }}
                    </template>
                </el-table-column>
                <el-table-column
                    prop="transferBeforeName"
                    align="center"
                    show-overflow-tooltip
                    min-width="180"
                    label="车辆产权公司">
                    <template v-slot="{row}">
                        {{row.transferBeforeName|filterNull}}
                    </template>
                </el-table-column>
                <el-table-column
                    prop="transferAfterName"
                    align="center"
                    show-overflow-tooltip
                    min-width="220"
                    label="过户后车辆产权公司">
                    <template v-slot="{row}">
                        {{row.transferAfterName|filterNull}}
                    </template>
                </el-table-column>
                <el-table-column
                    prop="newCarNo"
                    align="center"
                    show-overflow-tooltip
                    min-width="180"
                    label="过户后车牌号">
                    <template v-slot="{row}">
                        {{row.newCarNo|filterNull}}
                    </template>
                </el-table-column>
                <el-table-column
                    prop="transferFee"
                    align="center"
                    show-overflow-tooltip
                    min-width="150"
                    label="过户费用">
                    <template v-slot="{row}">
                        {{row.transferFee|filterNull}}
                    </template>
                </el-table-column>
                <el-table-column
                    prop="transferTime"
                    align="center"
                    show-overflow-tooltip
                    min-width="150"
                    label="过户时间">
                    <template v-slot="{row}">
                        {{row.transferTime|filterNull}}
                    </template>
                </el-table-column>
                <el-table-column
                    prop="registrationCertificate"
                    align="center"
                    show-overflow-tooltip
                    min-width="150"
                    label="登记证">
                    <template v-slot="scope">
                        <e-button size="mini" type="text"
                                  @click="handleUpload(scope.row, scope.$index, 0)">查看
                        </e-button>
                    </template>
                </el-table-column>
                <el-table-column
                    prop="drivingBook"
                    align="center"
                    show-overflow-tooltip
                    min-width="150"
                    label="行驶本">
                    <template v-slot="scope">
                        <e-button size="mini" type="text"
                                  @click="handleUpload(scope.row, scope.$index, 1)">查看
                        </e-button>
                    </template>
                </el-table-column>

            </template>
        </table-page>

        <!--    登记证-->
        <el-dialog :title="0==dialogType?'登记证':'行驶本'" :visible.sync="publicOpen" append-to-body width="45%">
            <ImageCommon :disabled="true" v-model="0==dialogType?selObj.registrationCertificate:selObj.drivingBook"></ImageCommon>
        </el-dialog>
    </div>
</template>

<script>
import {transferListByCarId} from "@/api/zcwh/allocate";

export default {
    props: ['carId'],
    data() {
        return {
            dataList: [],
            loading: false,
            queryParam:{
                pageNum: 1,
                pageSize: 10,
            },
            total:0,
            publicOpen:false,
            selObj:{},
            dialogType:0
        };
    },
    created() {
        this.getList();
    },
    mounted() {
    },
    methods: {
        handleUpload(row, index, type) {
            this.publicOpen = true
            this.selObj = row
            this.dialogType = type
        },
        async getList() {
            this.loading = true;
            this.queryParam.carId = this.carId
            transferListByCarId(this.queryParam).then(res=>{
                this.dataList = res.rows
                this.total = res.total
                this.loading = false;
            }).finally(f=>{
                this.loading = false;
            })

        },

    },
};
</script>

<style scoped lang="scss">
.el-form {
    .box-card {
        font-size: 14px;
        margin-bottom: 20px;
    }
}
</style>


